<template>
	<view>
		<cu-custom bgColor="bg-gradual-blue" :isBack="false">
			<block slot="content">登录</block>
		</cu-custom>
		<scroll-view scroll-y>
			<view class="text-center " :style="[{animation: 'show ' + 0.4+ 's 1'}]">
				<image src="../../static/logo.png" mode='aspectFit' class="logo "></image>
			</view>
			<form>
				<view class="cu-form-group margin-top">
					<view class="title">用户名</view>
					<input placeholder="请输入用户名" name="input" v-model="userName"></input>
				</view>
				<view class="cu-form-group">
					<view class="title">密码</view>
					<input :password="!showPassword" v-model="password" placeholder="请输入密码" name="input"></input>
					<view class="action text-lg">
						<text :class="[showPassword ? 'cuIcon-attention' : 'cuIcon-attentionforbid']"
							@click="changePassword"></text>
					</view>
				</view>
				<view class="padding flex flex-direction">
					<button class="cu-btn bg-gradual-blue margin-tb-sm lg" @tap="onLogin()">登录</button>

				</view>
				<view class="cu-form-group margin-top">
					<button class="cu-btn bg-gradual-blue margin-tb-sm " @tap="onSetting()">设置</button>
					<button class="cu-btn bg-gradual-blue margin-tb-sm " @tap="onLogin()">扫码</button>
				</view>
			</form>
			<view class="service-info">
				服务热线：12312121212
			</view>
		</scroll-view>
	</view>
</template>

<script>
	export default {
		data() {
			return {
				loginWay: 2,
				showPassword: false, //是否显示明文
				userName: 'zhuqiyun',
				password: '1234567',
				phoneNo: '',
				smsCode: '',
				smsCountDown: 0,
				smsCountInterval: null,
			};
		},
		methods: {
			onLogin() {
				this.$Router.push({
					path: '/pages/org/org',
					success: (res) => {
						console.log(res)
					},
					fail: err => {
						console.log(err)
					}
				})
			}
		},
	}
</script>

<style>
	.logo {
		width: 200upx;
		height: 150px;
	}

	.cu-form-group .title {
		min-width: calc(4em + 15px);
	}

	.gradient-text {
		/* 	  font-size: 74rpx;
	  font-weight: bold; */
		background: linear-gradient(45deg, #0081ff, #1cbbb4);
		-webkit-background-clip: text;
		background-clip: text;
		color: transparent;
	}

	.service-info {
		font-weight: bold;
		position: fixed;
		bottom: 5upx;
		left: 0;
		right: 0;
		text-align: center;
	}
</style>
